<template>
  <el-card class="box-card" style="width: 95%">
    <template #header>
      <div class="card-header">
        <span>{{cardName}}</span>
        <router-link :to="cardLink">
            <el-button class="button" type="primary" text>前往相关页面</el-button>
        </router-link>
      </div>
    </template>
    <div v-for="items in itemList" :key="items" class="text item">
      {{items.info}}
    </div>
  </el-card>
</template>

<script>
export default {
    props: {
        cardName: String,
        cardLink: String,
        itemList: Array
    },
    setup() {
        // console.log(this.$props.cardName);
        // // console.log(this.cardLink);
        // // console.log(this.itemList);
    },
    watch: {
      cardName: function(newVal,oldVal){
        this.cardName = newVal; //newVal即是chartData
        console.log(this.cardName);
      },
      cardLink: function(newVal,oldVal){
        this.cardLink = newVal; //newVal即是chartData
        console.log(this.cardLink);
      },
      itemList: function(newVal,oldVal){
        this.itemList = newVal; //newVal即是chartData
        console.log(this.itemList);
      }
    },
}
</script>
